<template>
  <div>
    <basic-container>
      <third-register></third-register>
      <p style="text-align: center;">
        <img src="https://img.shields.io/badge/Release-V3.4.0-green.svg" alt="Downloads"/>
        <img src="https://img.shields.io/badge/JDK-1.8+-green.svg" alt="Build Status"/>
        <img src="https://img.shields.io/badge/Spring%20Cloud-2021-blue.svg" alt="Coverage Status"/>
        <img src="https://img.shields.io/badge/Spring%20Boot-2.7.1.RELEASE-blue.svg" alt="Downloads"/>

        <!--        <a target="_blank" href="https://bladex.vip">-->
        <!--          <img src="https://img.shields.io/badge/Saber%20Author-Small%20Chill-ff69b4.svg" alt="Downloads"/>-->
        <!--        </a>-->

        <!--        <a target="_blank" href="https://bladex.vip">-->
        <!--          <img src="https://img.shields.io/badge/Copyright%20-@BladeX-%23ff3f59.svg" alt="Downloads"/>-->
        <!--        </a>-->

      </p>
    </basic-container>
    <el-col :span="16">
      <basic-container>
        <el-collapse v-model="activeNames" @change="handleChange">
<!--          <el-collapse-item title="欢迎使用系统管理平台" name="1">-->
<!--            <div>1.我想说点什么</div>-->
<!--            <div>2.我想说点什么</div>-->
<!--            <div>3.我想说点什么</div>-->
<!--            <div>4.我想说点什么</div>-->
<!--            <div>5.我想说点什么</div>-->
<!--          </el-collapse-item>-->
        </el-collapse>
      </basic-container>
    </el-col>
    <el-col :span="8">
      <el-row>
        <basic-container>
          <div class="el-font-size">
            <span>系统名称</span>
            <el-divider direction="vertical"/>
            <span><el-tag>系统管理平台</el-tag></span>
            <el-divider content-position="right"><i class="el-icon-star-off"/></el-divider>
            <span>默认账号</span>
            <el-divider direction="vertical"/>
            <el-tag effect="plain">管理员(admin)</el-tag>
            <el-divider content-position="right"><i class="el-icon-star-off"/></el-divider>
            <span>跳转地址</span>
            <el-divider direction="vertical"/>
            <span><el-link href="https://www.baidu.com/" target="_blank"
                           type="primary">https://www.baidu.com/</el-link></span>
            <el-divider content-position="right"><i class="el-icon-star-off"/></el-divider>
            <span>跳转按钮</span>
            <el-divider direction="vertical"/>
            <span class="tag-group">
                <el-tag type="success" style="cursor: pointer"
                        onclick="window.open('https://www.baidu.com/')">按钮</el-tag>
                <el-divider direction="vertical"/>
                <el-tag type="danger" style="cursor: pointer"
                        onclick="window.open('https://www.baidu.com/')">按钮</el-tag>
              </span>
            <el-divider content-position="right"><i class="el-icon-star-off"/></el-divider>
            <span>跳转按钮</span>
            <el-divider direction="vertical"/>
            <span class="tag-group">
                <el-tag type="success" effect="dark" style="cursor: pointer"
                        onclick="window.open('https://www.baidu.com/')">按钮</el-tag>
                <el-divider direction="vertical"/>
                <el-tag type="danger" effect="dark" style="cursor: pointer"
                        onclick="window.open('https://www.baidu.com/')">按钮</el-tag>
              </span>
          </div>
        </basic-container>
      </el-row>
    </el-col>
  </div>
</template>

<script>
import {mapGetters} from "vuex";

export default {
  name: "wel",
  data() {
    return {
      activeNames: ['1', '2', '3', '5'],
      logActiveNames: ['30']
    };
  },
  computed: {
    ...mapGetters(["userInfo"]),
  },
  created() {
  },
  methods: {
    handleChange(val) {
      console.log(val);
    }
  }
};
</script>

<style>
.el-divider--horizontal {
  margin: 12px 0 !important;
}

.el-font-size {
  font-size: 14px;
}
</style>

